<template>
  <div class="app_content">
    <el-card>
      <el-form ref="msgForm" label-position="top" label-width="80px" :model="formLabelAlign">
        <el-form-item label="姓名">
          <el-input v-model="formLabelAlign.zwh_name" disabled></el-input>
        </el-form-item>
        <!-- <el-form-item label="留言封面" prop="content">
          <el-input v-model="formLabelAlign.content" @keyup.enter.native="submitForm('msgForm')"></el-input>
        </el-form-item> -->
        <el-form-item label="简要">
          <el-input v-model="formLabelAlign.zwh_title" disabled></el-input>
        </el-form-item>
        <el-form-item label="详细内容">
          <!-- <Quill ref="quill" /> -->
          <p v-html="formLabelAlign.zwh_content" style="padding:15px 30px;background:#f5f7fa;border-radius: 4px;border: 1px solid #DCDFE6;"></p>
        </el-form-item>
      </el-form>
    </el-card>
  </div>
</template>

<script>
// import Quill from '@/views/common/Quill.vue'
import { ref, reactive, toRefs, getCurrentInstance, onMounted } from 'vue'
export default {
  name: 'work',
  // components: {
  //   Quill,
  // },
  setup() {
    const { proxy } = getCurrentInstance()
    const msgForm = ref()
    const quill = ref()

    const state = reactive({
      formLabelAlign: {},
    })

    onMounted(() => {
      // hiddenQuillTop()
      getDetail()
    })

    const getDetail = () => {
      state.formLabelAlign = proxy.storage.getLocal('msgStorage')
      // proxy.$refs.quill.setContent(state.formLabelAlign.zwh_content)
    }

    const hiddenQuillTop = () => {
      let quillTopChildrens =
        proxy.$refs.quill.$el.children[0].children[0].children
      for (let i = 0; i < quillTopChildrens.length; i++) {
        quillTopChildrens[i].style.display = 'none'
      }
    }

    return {
      ...toRefs(state),
      msgForm,
      quill,
    }
  },
}
</script>

<style>
</style>